<template>
	<view class="container">
		<view class="up">
			<view class="title">果树信息</view>
			<view class="info-container">
				<view>果树数量：{{info.fruitTreeNum}}棵</view>
				<view>租地时间：{{info.tenancyDuration}}</view>
				<view>
					租金合计：
					<text class="price">{{info.rent}}元</text>
				</view>
			</view>
		</view>
		<view class="bottom">
			<view class="info-container">
				<view>签署人：{{info.fosterName}}</view>
				<view>联系方式：{{info.phone}}</view>
				<view>订单号：{{info.orderNo}}</view>
			</view>
			<view>
				<u-button v-if="orderNo" :custom-style="{height:60+'rpx',lineHeight:60+'rpx'}" text="付款" color="#17CC77" @click="goPay"></u-button>
			</view>
		</view>
		
	</view>
</template>

<script>
	import {findTenancyOrderById,pay} from "@/api/api.js"
	export default {
		data() {
			return {
				info:{},
				payParams:{},
				orderNo:''
			};
		},
		onLoad(routerParams) {
			console.log(routerParams);
			if(routerParams.orderNo){
				this.orderNo = routerParams.orderNo
			}
			if(routerParams?.id){
				this.getInfo(routerParams.id)
			}else{
				uni.$u.toast('当前没有订单id即将自动返回订单中心')
				setTimeout(()=>{
					uni.navigateBack()
				},500)
			}
		},
		methods:{
			async getInfo(id){
				const res = await findTenancyOrderById(id)
				if(res?.data.code == 200 && res?.data.data){
					this.info = res.data.data
				}else{
					uni.$u.toast(res.data.msg)
				}
			},
			async goPay(){
				uni.showLoading({
					title:"请稍侯",
					mask:true
				})
				const res = await pay(this.orderNo)
				console.log(res);
				if(res?.data.code == 200){
					this.payParams = res.data.data
					uni.showToast({
						title: res.data.msg,
						icon: 'success'
					})
					uni.hideLoading()
					this.openWeixinPay()
				}else{
					uni.hideLoading()
					uni.showToast({
						title:res.data.msg,
						icon:'error'
					})
				}
			},
			openWeixinPay(){
				wx.requestPayment({
					...this.payParams,
					success: (res) => {
						console.log('唤起微信支付',res);
						if(res){
							uni.showToast({
								title:'支付成功',
								icon:'success'
							})
							setTimeout(()=>{
								uni.navigateBack()
							},1500)
						}
					},
					fail: (err) => {
						if(err.errMsg == 'requestPayment:fail cancel'){
							uni.showToast({
								title:'取消支付',
								icon:'error'
							})
						}else{
							uni.showToast({
								title:'支付失败',
								icon:'error'
							})
						}
						
					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
.container{
	padding: 40rpx;
	background-color: #ffffff;
	box-shadow:  0 0 2rpx 2rpx #dedede;
	.info-container{
		margin: 20rpx 0 20rpx 0;
		color: #3f3f3f;
		.price{
			color: #dd0606;
		}
		view{
			margin-bottom: 10rpx;
			font-size: 30rpx;
		}
		view:nth-child(3){
			white-space: nowrap;
		}
	}
	.up{
		.title{
			font-weight: 500;
			font-weight: 34rpx;
		}
		border-bottom: 2rpx solid #dfdfdf;
	}
	.bottom{
		
	}
}
</style>
